<!DOCTYPE html>
<html>
<head>
  <title>Basic profiling of wasm functions</title>
  <script>
    function getTime() {
      return BigInt(Date.now());
    }

    (async () => {
      const importObject = { imports: { getTime } };
      let instance = await WebAssembly.instantiateStreaming(fetch('profiling.wasm'), importObject);
      console.log(instance.instance.exports.mainWasm());
    })().catch(console.error);
  </script>
</head>
<body>
  <h1></h1>
  <p>
    This tests that we can successfully profile a wasm application and view the file, the accumulated time as well as the call tree.
  </p>
  <h2>Steps</h2>
  <p>
    <ol>
      <li>Open DevTools</li>
      <li>Open the Performance Tab</li>
      <li>Click the record button</li>
      <li>Reload the page and wait for application to finish (console output appears)</li>
      <li>Stop the recording</li>
      <li>Check if the performance tab reflects the correct info:</li>
      Check "Summary" tab:
      <ol>
        <li>Search for "mainWasm" (CMD/CTRL-F)</li>
        <li>The "Summary" tab shows a non-zero total time for "mainWasm"</li>
        <li>Clicking on the function link should redirect to the "profiling.wasm" file in the Sources tab</li>
      </ol>
      Check "Bottom Up" tab:
      <ol>
        <li>Search for "mainWasm" (CMD/CTRL-F)</li>
        <li>Click on the "Bottom Up" Tab</li>
        <li>Expand the tree for "mainWasm"; it should show: "mainWasm", "js-to-wasm:.*", "(anonymous)", "Run Microtasks</li>
      </ol>
      Check "Call Tree" tab:
      <ol>
        <li>Search for "mainWasm" (CMD/CTRL-F)</li>
        <li>Click on the "Call Tree" tab</li>
        <li>Expand the tree for "Run Microtasks"; it should show: "Run Microtasks", "(anonymous)", "js-to-wasm:.*", "mainWasm", "getTime"</li>
        <li>Clear the profile</li>
      </ol>
    </ol>
  </p>
</body>
</html>